import {
  forwardRef,
  Component,
  ViewEncapsulation,
  ChangeDetectionStrategy,
  ChangeDetectorRef,
  Renderer2, ElementRef, Host, Optional,
} from '@angular/core';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
import { ApesNoAnimationDirective } from '@shared/apes/core';
import { ApesI18nService, DateHelperService } from '@shared/apes/i18n';

import { DateRangePickerComponent } from './date-range-picker.component';

@Component({
  selector   : 'apes-date-picker',
  exportAs: 'apesDatePicker',
  templateUrl: './date-range-picker.component.html',
  encapsulation: ViewEncapsulation.None,
  changeDetection: ChangeDetectionStrategy.OnPush,
  providers  : [ {
    provide    : NG_VALUE_ACCESSOR,
    multi      : true,
    useExisting: forwardRef(() => ApesDatePickerComponent)
  } ],
  host       : {
    '[class.apes-calendar-picker]': 'true'
  }
})

export class ApesDatePickerComponent extends DateRangePickerComponent {
  isRange: boolean = false;

  constructor(
    i18n: ApesI18nService,
    cdr: ChangeDetectorRef,
    dateHelper: DateHelperService,
    renderer: Renderer2,
    elementRef: ElementRef,
    @Host() @Optional() public noAnimation?: ApesNoAnimationDirective
  ) {
    super(i18n, cdr, dateHelper, noAnimation);
    renderer.addClass(elementRef.nativeElement, 'apes-calendar-picker');
  }
}
